<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title>用户登录</title>
		<!-- IE -->
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<!-- 设置 viewport -->
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<!-- 兼容国产浏览器的高速模式 -->
		<meta name="renderer" content="webkit">
		<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
		<link rel="stylesheet" type="text/css" href="lib/bootstrap-3.3.7-dist/css/bootstrap.css" />
		<link rel="stylesheet" type="text/css" href="lib/bootstrapvalidator/dist/css/bootstrapValidator.css" />
		<style type="text/css">
			html {
				width: 100vw;
				height: 100vh;
			}
			
			body {
				width: 100%;
				height: 100%;
				/*background: url(img/login/banner.jpg) no-repeat;*/
				background-size: cover;
				position: relative;
			}
			
			.loginBox {
				box-sizing: border-box;
				width: 400px;
				height: 360px;
				background: #fff;
				margin: 20px;
			}
			
			#form .form-group {
				width: 340px;
				margin: 0 auto;
				margin-top: 40px;
			}
			#loginBg{
				box-sizing: border-box;
				background: rgba(63, 123, 173, 0.3);
				width: 440px;
				height: 400px;
				position: absolute;
				margin: -220px -200px;
				top: 50%;
				left: 50%;
			}
		</style>
	</head>

	<body class="hide">
		<div id="loginBg">
			<div class="loginBox">
				<form action="" class="form" id="form">
					<div class="school-title text-center" style="padding-top: 20px;">
						<h2 class="schoolName">罗湖外语学校考勤系统</h2>
					</div>
					<div class="form-group">
						<label class="sr-only" for="username">账号</label>
						<div class="input-group">
							<div class="input-group-addon">
								<img src="img/login/account.png" />
							</div>
							<input type="text" class="form-control" id="username" placeholder="请输入用户账号" name="username">
						</div>
					</div>
					<div class="form-group">
						<label class="sr-only" for="password">密码</label>
						<div class="input-group">
							<div class="input-group-addon">
								<img src="img/login/password.png" />
							</div>
							<input type="text" class="form-control" id="password" placeholder="请输入用户密码" name="password" onfocus="this.removeAttribute('readonly');this.type='password'" autocomplete="off">
						</div>
					</div>
					<!--<div class="form-group" style="margin-top: 20px;">
					    <div class="">
					      <div class="checkbox">
					        <label>
					          <input type="checkbox"> 记住密码
					        </label>
					      </div>
					    </div>
					</div>-->
					<div class="form-group" style="margin-top: 40px;">
						<button type="button" class="btn btn-primary  btn-block btn-save">登录</button>
					</div>
				</form>
			</div>
		</div>
		

		<script src="lib/jquery/1.9.1/jquery.js" type="text/javascript" charset="utf-8"></script>
		<!--<script src="lib/bootstrap-3.3.7-dist/js/bootstrap.js" type="text/javascript" charset="utf-8"></script>-->
		<script src="lib/layer/2.4/layer.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/common/jsrsasign-all-min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/common/crypto-js.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/common/jquery.myPlugIn_v1.0.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/common/localstorage-ie.js" type="text/javascript" charset="utf-8"></script>
		<script src="lib/bootstrapvalidator/dist/js/bootstrapValidator.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$(document).ready(function() {
				//清除权限
				localStorage.removeItem("menuMsg");
				//
				localStorage.setItem("schoolId",$.getQueryString("schoolId"));
				
				//获取学校信息
				fnAjax.method_login(
					url_join("common/school/show"),
					{
//						school_id:localStorage.getItem("schoolId"),//测试版本要传
						school_id:$.getQueryString("schoolId"),//测试版本要传
					},
					"post",
					function(data){
						console.log(data);
						$("body").removeClass("hide");
//						$("#username").val(data.data.user.username);
//						$("#password").val(data.data.user.password);
						$("body").css({
							"backgroundImage":"url("+ url_join("") + data.data.school.image +")",
							"backgroundSize":"cover"
						});
						localStorage.setItem("schoolLogo",url_join("")+data.data.school.logo);
						localStorage.setItem("schoolName",data.data.school.name);
						
						$(".schoolName,title").text(data.data.school.name);
					}
				);
				
				
				$('#form')
					.bootstrapValidator({
						message: '这个值是无效的',
						feedbackIcons: {
							valid: 'glyphicon glyphicon-ok',
							invalid: 'glyphicon glyphicon-remove',
							validating: 'glyphicon glyphicon-refresh'
						},
						fields: {							
							username: {
								message: '账号是无效的',
								validators: {
									notEmpty: {
										message: '账号是必需的，不能是空的'
									},
									stringLength: {
										min: 3,
										max: 20,
										message: '账号必须大于3，小于20个字符'
									},
									regexp: {
										regexp: /^[a-zA-Z0-9_\.]+$/,
										message: '账号只能由字母、数字、点和下划线组成'
									},
//									different: {
//										field: 'password',
//										message: '账号和密码不可能是相同的'
//									}
								}
							},
							
							password: {
								validators: {
									notEmpty: {
										message: '密码是必需的，不能是空的'
									},	
									stringLength: {
										min: 3,
										max: 20,
										message: '密码必须大于3，小于20个字符'
									},
									regexp: {
										regexp: /^[a-zA-Z0-9_\.]+$/,
										message: '密码只能由字母、数字、点和下划线组成'
									},
//									different: {
//										field: 'username',
//										message: '密码不可能与账号相同'
//									}
								}
							},
							
						}
					})
					.on('success.form.bv', function(e) {
						// 阻止表单提交
						e.preventDefault();
						// 获得表单实例
						var $form = $(e.target);
						// 得到BootstrapValidator实例
						var bv = $form.data('bootstrapValidator');
						// 使用Ajax提交表单数据
						$('#form').append($('<input type="hidden" value="'+ $.getQueryString("schoolId") +'" name="school_id"/>'));
						fnAjax.method_login(
							url_join("auth/login"),
							$form.serialize(),
							"post",
							function(data){
								console.log(data);
								//判断是否超级管理员
								if(data.data.user.super == 1 && !data.data.user.role_id){
									data.data.menu.push({
										children:[
											{
												icon_name:"password",
												id:"100043",
												menu_id:"1000",
												name:"密码管理",
												url:"component/adminManage/passwordManage.html"
											}
										],
										icon_name:"icon-lock",
										name:"密码管理",
										id:"1000",
										menu_id:"0",
										open:true,
										url:""
									});
								}
								localStorage.setItem("token",data.data.token);//存token
								localStorage.setItem("userMsg",JSON.stringify(data.data.user));//存用户信息
								localStorage.setItem("layoutMsg",JSON.stringify(data.data.layout));//存用户个性化定制数据
								//强制把权限组转化为数组
								var aMenu = [];
								for(var k in data.data.menu){
									aMenu.push(data.data.menu[k]);
								}
								localStorage.setItem("menuMsg",JSON.stringify(aMenu));//存用户菜单权限数据
								localStorage.setItem("semester",JSON.stringify(data.data.semester));//存用户学期数据，id 学期ID，name 学期名称，start_at 学期开始时间，end_at 学期结束时间
								localStorage.setItem("loginUrl",window.location.href);
								
								if(data.data.menu){
									layer.msg("登陆成功",{time:1500},function(){
										console.log(aMenu);
										window.location.href = "index.html";
									});
								}else{
									layer.alert("该系统没有该用户");
								}
								
								
							}
						);
					});
				// 手动验证表单
				$('.btn-save').click(function() {
					$('#form').bootstrapValidator('validate');
				});

				$(window).keyup(function(event){
					if(event.keyCode == "13") {
						$(".btn-save").trigger("click");
					}
				});
			});
		</script>
	</body>

</html>